<!--
 * @Descripttion: 
 * @version: 
 * @Author: cyj
 * @Date: 2023-02-13 16:32:36
-->
<template>
    <div>
        <!-- 歌手简介 -->
        <div class="singer-name">{{ props.singerName }}简介:</div>
        <div class="singer-info">
            <p>{{ props.briefDesc }}</p>
        </div>
        <!-- 歌手经历 -->
        <div class="singer-introduction">
            <div v-for="(item, index) in props.singerDes" :key="index">
                <!-- 经历标题 -->
                <div class="singer-name">
                    {{ item.ti }}:
                </div>
                <div class="txt">
                    {{ item.txt }}
                </div>
            </div>
        </div>
    </div>
</template>

<script setup>
const props = defineProps({
    singerDes: Array,
    briefDesc: String,
    singerName: String
})
</script>

<style lang="scss" scoped>
.singer-name {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px;
}

.singer-info {
    color: #666666;
}

.singer-introduction {
    margin-top: 20px;

    .txt {
        margin-bottom: 30px;
        color: #666666;

    }
}
</style>